 /* 
    Document   : tabs
    Created on : 2011-07-29, 22:28:26
    Author     : pawel
    Description:
        Purpose of the stylesheet follows.
*/

.cTabs{
  height: 26px;
  position: relative;
  padding-left: 10px;
  font-family: sans-serif;
  font-size: 12px;
  z-index: 2;
}

.cTabs ul li{
  position: relative;
  padding: 5px;
  padding-top: 4px;
  display: inline-block;
  list-style: none;
  -moz-border-radius: 5px 5px 0px 0px;
  -webkit-border-radius: 5px 5px 0px 0px;
  border: 1px solid #161616;
  border-bottom: 0px;
  cursor: pointer;
}

.cTabs ul li.active{
  top: 1px;
  border-color:#3399FF;
  background-color: #252525;
}

.cTabs ul li.active a{
  color: #F1F1F1;
}

.cTabs ul li.active a:before{
  content: '{ ';
}

.cTabs ul li.active a:after{
  content: ' }';
}

.cTabs ul li.inactive{
  border-color: #161616;
}

.cTabs ul li.inactive a{
  color: #4D4D4D;
}

.cTabs ul li.inactive:hover{
  -moz-border-radius: 5px 5px 0px 0px;
  -webkit-border-radius: 5px 5px 0px 0px;
  border: 1px solid #3399FF;
  border-bottom: 0px;
}

.cIcons{
  height: 90px;
  position: relative;
  top: -1px;
  padding: 3px;
  -moz-border-radius: 10px 10px 0px 0px;
  -webkit-border-radius: 10px 10px 0px 0px;
  border: 1px solid #3399FF;
  z-index: 1;
  font-size: 11px;
  background-image: 
    -moz-linear-gradient(center bottom, #080808 20%, #252525 83%);
  background-image: 
    -webkit-gradient(linear, center bottom, center top, color-stop(20%, #080808), color-stop(83%, #252525));
}

.cIcons > div[id]{
  position: absolute;
  left: -1px;
  top: 5px;
}

.cIcons > div[id] #title{
  font-size: 10px;
  color: #252525;
}

.cIcons > div[id] #separator{
  margin-left: 10px;
  display: inline-block;
  width: 0px;
  height: 78px;
  border-left: 1px solid #3399FF;
  border-right: 1px solid #4D4D4D;
}

.cIcons > div[id].active{
  visibility: visible;
}

.cIcons > div[id].inactive{
  visibility: hidden;
}

.cIcons div .cIcon a > img, .cIcon a > img{
  border: 0px;
  text-decoration: none;
}

.cIcons div .cIcon, .cIcon{
  display: inline-block;
  margin-left: 6px;
  margin-right: 6px;
  margin-bottom: 2px;
  text-align: center;
  cursor: pointer;
  border: 1px solid transparent;
}

.cIcons div .cIcon:hover, .cIcon:hover{
  border: 1px solid #4D4D4D;
  background-image: 
  -moz-linear-gradient(center bottom, #191919 40%, #080808 70%);
  -webkit-linear-gradient(center bottom, #191919 40%, #080808 70%);
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
}

.cIcons div .cIcon a *, .cIcon a *{
  margin: 0px auto;
  width: auto;
  padding: 2px;
  display: block;
}

.cIcons div .cIconsGroup{
  display: inline-block;
  margin-left: 10px;
  text-align: center;
}

.cIcons div .cIconsGroup #title{
  padding: 4px;
  border-top: 1px solid #191919;
}

.cIconsGroup:hover div#title{
  color: #4D4D4D;
}

.cIcons div .cIconsPalette{
  width: 130px;
  position: relative;
  top: -12px;
  margin-left: 10px;
  display: inline-block;
}

.cIcons div .cIconsPalette > p{
  display: inline-block;
  padding: 3px;
  border: 1px solid #191919;
}

.cIcons div .cIconsPalette > p:hover{
  border: 1px solid #313131;
  cursor: pointer;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
}

.cIcons div .cIconsPalette > p > img{
  padding: 0px;
  margin: 0px;
  float: left;
}